﻿@{
    Layout = null;
}
@using Webdiyer.WebControls.Mvc;
@model PagedList<ChuangDu_Spirit_QGB_Model.VIPInfo>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>会员卡表</title>
    <link href="~/Layui/layui-v2.2.3/layui/css/layui.css" rel="stylesheet" />
    <link href="~/Layui/layui-v2.2.3/layui/css/modules/layer/default/layer.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Layui/layui-v2.2.3/layui/layui.js"></script>
    <script src="~/Layui/layui-v2.2.3/layui/lay/modules/layer.js"></script>
    <script src="~/MvcPager.js"></script>

    <style>
        button:hover {
            background-color: #ff6a00;
        }

        ul li {
            list-style: none;
            display: inline-block;
            height: 40px;
            width: auto;
            text-align: center;
            border: 1px solid #dbdbdb;
            line-height: 40px;
            padding: 0 10px;
        }

        .class1 {
            background-color: #dbdbdb;
        }
    </style>

</head>
<body>
    <div style="width:100%;height:50px;margin:0 auto">
        <div class="layui-btn-group" style="float:left;padding-left:20px;padding-top:20px;">
            <button id="CheckALL" class="layui-btn"><i class="layui-icon">&#xe627;</i>全选</button>
            <button id="CancelALL" class="layui-btn" style="display:none"><i class="layui-icon">&#xe627;</i>取消</button>
            <button id="Refresh" class="layui-btn"><i class="layui-icon">&#x1002;</i>刷新</button>
            <button id="NewAdd" class="layui-btn"><i class="layui-icon">&#xe608;</i>新建会员卡</button>
            <button id="Redact" class="layui-btn"><i class="layui-icon">&#xe642;</i>编辑</button>
            <button id="Delete" class="layui-btn"> <i class="layui-icon">&#xe640;</i>删除</button>
            <button id="ToExcel" class="layui-btn"><i class="layui-icon">&#xe67c;</i>导入EXCEL</button>
            <button id="ToPage" class="layui-btn"><i class="layui-icon">&#xe609;</i>导出本页</button>
            <button id="ToALL" class="layui-btn"><i class="layui-icon">&#xe62d;</i>导出全部</button>
        </div>
        <div class="demothead" style="float:right;padding-right:20px;padding-top:20px;">
            <div class="layui-inline">
                <input class="layui-input" name="id" id="CheckText" autocomplete="off">
            </div>
            <button id="Check" class="layui-btn"><i class="layui-icon">&#xe615;</i></button>
            <button id="Install" class="layui-btn"><i class="layui-icon">&#xe614;</i></button>
        </div>
    </div>
    <div style="width:100%;height:400px; overflow-y:scroll; overflow-x:scroll;margin-top:30px">
        <div style="width:300%;height:399px;">
            <table class="layui-table" style="text-align:center;">
                <thead>
                    <tr style="background-color:#009688;color:#ffffff">
                        <td><input id="CheckALL1" type="checkbox" onclick="Check(this)" /></td>
                        <td>编号</td>
                        <td>客户名称</td>
                        <td>分类</td>
                        <td>等级</td>
                        <td>卡号</td>
                        <td>是否有效</td>
                        <td>主卡</td>
                        <td>发卡日期</td>
                        <td>过期日期</td>
                        <td>总次数</td>
                        <td>消费次数</td>
                        <td>剩余次数</td>
                        <td>总金额</td>
                        <td>单次消费金额</td>
                        <td>消费金额</td>
                        <td>余额</td>
                        <td>经办人</td>
                        <td>备注</td>
                        <td>附件</td>
                        <td>添加人</td>
                        <td>创建日期</td>
                        <td>更新人</td>
                    </tr>
                </thead>

                @foreach (var i in Model)
            {
                    <tr>
                        <td><input name="CheckSingle" type="checkbox" value="@i.ID" /></td>
                        <<td>@i.ID</td>
                        <td>@i.Vclientname</td>
                        <td>@i.Vtype</td>
                        <td>@i.Vgrade</td>
                        <td>@i.Vnumber</td>
                        <td>@i.Veffect</td>
                        <td>@i.Vmaincar</td>
                        <td>@i.VSendcardate</td>
                        <td>@i.Vpastdate</td>
                        <td>@i.Vsumnumber</td>
                        <td>@i.Vexpendituretime</td>
                        <td>@i.Vresiduetime</td>
                        <td>@i.Vmoney</td>
                        <td>@i.Vresiduemoeny</td>
                        <td>@i.Vresiduemoney</td>
                        <td>@i.Vresidueremaining</td>
                        <td>@i.Voperator</td>
                        <td>@i.Vremaek</td>
                        <td>@i.Vaccessory</td>
                        <td>@i.Vaddperson</td>
                        <td>@i.Vcreatetime</td>
                        <td>@i.Vupdateperson</td>
                    </tr>
                }

            </table>


        </div>
    </div>

    <div style="padding-left:50px;margin-top:30px">
        @*<div>
                <span style="font-size:25px"> @Model.CurrentPageIndex/ @Model.TotalPageCount</span> <span style="font-size:25px">
                    总共 @Model.TotalItemCount 条记录

                </span>
            </div>*@
        <div style="float:left;background-color:#009688;height:40px;width:100px;text-align:center;line-height:40px;font-size:15px;border-bottom-color:#000000">
            共 @Model.TotalItemCount 记录
        </div>
        <div style="float:left;background-color:#009688;height:40px;width:150px;text-align:center">
            显示&nbsp;&nbsp;<input id="page" type="text" style="height:38px;width:50px;text-align:center" placeholder="4" />&nbsp;&nbsp;页/条
        </div>
        <div style="float:left">

            @Ajax.Pager(Model, new PagerOptions { PageIndexParameterName = "pageid", HtmlAttributes = new Dictionary<string, object> { { "style", "float:model" } }, PagerItemTemplate = "&nbsp;{0}", FirstPageText = "<input id='Button1' type='button' value='第一页' style='width:60px;height:40px;background-color:#009688' />", PrevPageText = "<input id='Button1' type='button' value='上一页' style='width:60px;height:40px;background-color:#009688'/>", NextPageText = "<input id='Button1' type='button' value='下一页' style='width:60px;height:40px;background-color:#009688'", LastPageText = "<input id='Button1' type='button' value='最后一页' style='width:60px;height:40px;background-color:#009688' />" })
        </div>
    </div>

    <script>
         //设置显示哪些字段
          $("#Install").click(function () {
            //var tab = document.getElementsByTagName('table')[0];
            //var trs = tab.rows;
            //for (var i = 0, len = trs.length; i < len; i++) {
            //    var cell = trs[i].cells[2];
            //    if (cell.style.display =='none') {
            //        cell.style.display = '';
            //    }
            //    else {
            //        cell.style.display = 'none'
            //    }
            //}
            var str = [];
            var i = 0;
            $("thead>tr>td").each(function () {
                str.push($(this).html());
                i++;
            });
            var str1 = "<ul>";
            for (var u = 0; u < str.length; u++)
            {
                if (u == 0) {
                }
                else {
                    str1 += "<li onclick='ClickLi(this)'>" + str[u] + "</li> &nbsp; &nbsp; &nbsp;"
                }

            }
            str1 += "</ul>";
            layer.open({
                type: 1,
                title: ['<i class="layui-icon">&#xe614;</i>显示字段设置', 'font-size:20px'],
                area: ['800px', '300px'],
                content: str1,
                btn: ['应用设置', '还原默认使用'],
                yes: function (index, layero) {
                    var m = 1;
                    $("li").each(function () {
                        if ($(this).hasClass("class1"))
                        {
                            var tab = document.getElementsByTagName('table')[0];
                            var trs = tab.rows;
                            for (var i = 0, len = trs.length; i < len; i++) {
                                var cell = trs[i].cells[m];
                                cell.style.display = "";
                            }
                            m++;
                        }
                        else
                        {
                            var tab = document.getElementsByTagName('table')[0];
                            var trs = tab.rows;
                            for (var i = 0, len = trs.length; i < len; i++) {
                                var cell = trs[i].cells[m];
                                cell.style.display = "none";
                            }
                            m++;
                        }
                    })

                    layer.close(index);
                },
                btn2: function (index, layero) {

                }
            })
        })
        function ClickLi(obj) //给选中的字段名添加样式
        {
            $(obj).toggleClass("class1")
        }
        $("#CheckALL").hover(function () {
            layer.tips('全选', '#CheckALL', {
                tips: [3, '#b6ff00']
            });

        })
        $("#Refresh").hover(function () {
            layer.tips('刷新', '#Refresh', {
                tips: [3, '#b6ff00']
            });

        })
        $("#NewAdd").hover(function () {
            layer.tips('新建合同/订单', '#NewAdd', {
                tips: [3, '#b6ff00']
            });

        })
        $("#Redact").hover(function () {
            layer.tips('编辑', '#Redact', {
                tips: [3, '#b6ff00']
            });

        })
        $("#Delete").hover(function () {
            layer.tips('删除', '#Delete', {
                tips: [3, '#b6ff00']
            });

        })
        $("#ToExcel").hover(function () {
            layer.tips('导入EXCEL', '#ToExcel', {
                tips: [3, '#b6ff00']
            });

        })
        $("#ToPage").hover(function () {
            layer.tips('导入本业', '#ToPage', {
                tips: [3, '#b6ff00']
            });

        })
        $("#ToALL").hover(function () {
            layer.tips('导出全部', '#ToALL', {
                tips: [3, '#b6ff00']
            });

        })
        $("#Check").hover(function () {
            layer.tips('快速模糊查询', '#Check', {
                tips: [3, '#b6ff00']
            });
        })
        $("#CheckText").hover(function () {
            layer.tips('可输入任意关键字进行查询', '#CheckText', {
                tips: [3, '#43e8dd']
            });
        })
        $("#CancelALL").hover(function () {
            layer.tips('取消', '#CancelALL', {
                tips: [3, '#43e8dd']
            });
        })
        $("#page").blur(function () {
            var pagesize = $("#page").val();

            if (pagesize != "" && pagesize != "0") {
                location.href = "/Sprintfuyu/Sell/OrderManagementShow?pagesize=" + pagesize;
                //$.ajax({
                //    url: "/Sell/OrderManagementShow",
                //    data: { pagesize: $("#page").val() },
                //    success: function (data) {
                //        location.href = "";

                //    }
                //})
            }

        })
        $("#CheckALL").click(function () {
            layer.tips('', 'this')
            $("input[id='CheckALL1']:checkbox").prop("checked", true);
            $("input[name='CheckSingle']:checkbox").prop("checked", true);
            $("#CheckALL").hide();
            $("#CancelALL").show();
            //$("input[name='ck']:checkbox").each(function () {
            //    $(this).prop("checked", !$(this).prop("checked"));
        })
        $("#CancelALL").click(function () {
            layer.tips('', 'this')
            $("input[id='CheckALL1']:checkbox").prop("checked", false);
            $("input[name='CheckSingle']:checkbox").prop("checked", false);
            $("#CancelALL").hide();
            $("#CheckALL").show();


        })
        $("#Refresh").click(function () {
            window.location.reload();
        })
        $("#Delete").click(function () {
            var i = 0
            var ids = [];
            $("input[name='CheckSingle']:checked").each(function (index, obj) {
                i++;
                ids.push($(obj).val());
            })

            if (i == 0) {
                layer.msg("请选择您要删除的记录");
            }
            else {
                layer.msg('您确定要删除这' + i + '条记录吗？', {
                    time: 0,
                    btn: ['当然', '突然不想了']
                    , yes: function (index) {
                        layer.close(index);

                        $.ajax({
                            url: "/Sprintfuyu/Sell/VIPInfoDelete",
                            data:{ids:ids.toString()},
                            type: "post",
                            dataType:"json",
                            success: function (date) {
                                if (date == 0) {
                                    layer.msg("删除失败");
                                }
                                else {
                                    layer.msg("删除成功");
                                    window.location.reload();
                                }
                            }
                        })

                    }
                })
            }



        })

        //单选框的选中
        function Check(ck) {
            if (ck.checked == true) {

                $("input[name='CheckSingle']:checkbox").prop("checked", true)
            }
            else {
                $("input[name='CheckSingle']:checkbox").each(function () {
                    $(this).prop("checked", !$(this).prop("checked"));

                })
            }

        }

    </script>



</body>
</html>